import React from "react";
import { LazyImage } from "../";
import style from './style.module.css';
interface PropsType {
  id: string;
  title: string;
  url: string;
  price: string | number;
  onClick?: () => void;
}

export const HomeListItem: React.FC<PropsType> = ({
  id,
  title,
  url,
  price,
  onClick,
}) => {
  return (
    <dl key={id} onClick={onClick} className={ style['dl'] }>
      <dt>
        <LazyImage src={url}></LazyImage>
      </dt>
      <dd>
        <h3>{title}</h3>
        <b style={{ color: "red" }}>￥：{price}</b>
      </dd>
    </dl>
  );
};
